<template>
  <div class="_box-scroll _over-scroll-hidden _wrapper-y" v-loading="loading">
    <div class="_flex _flex-start _flex-space _flex-wrap _flex-dis-200p">
      <div
        v-for="item in iotModel.attributes"
        :key="item.code"
        class="_flex _flex-start _flex-space _cart _p10"
      >
        {{ item.name }}:
        <ComInput
          :dict="item.dict"
          v-model="item.val"
          @update:modelValue="(val) => updateAttr(item.code, val)"
        />
      </div>
    </div>
    <div class="_cart _m-t-10">
      <div class="_font-title">
        运行记录<span
          class="_font-reminder _font-mini _m-l-10"
          @click="initIotModelRows()"
          >刷新</span
        >
      </div>
      <div class="">
        <el-table :data="pageData.records" stripe border>
          <el-table-column label="动作" prop="name"></el-table-column>
          <el-table-column label="编码" prop="code"></el-table-column>
          <el-table-column label="数值" prop="val"></el-table-column>
          <el-table-column label="状态" prop="is_final"></el-table-column>
          <el-table-column label="时间" prop="created_date">
            <template #default="scope">
              {{ $tool.dateStr(scope.row.created_date) }}
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>
<script>
import toolAction from "@/tool/http/tool-action";
import ComInput from "@/components/com-input/com-input.vue";

let thingsAttributeApi = toolAction.init("things_attribute");
let thingsDeviceApi = toolAction.init("things_device");

export default {
  components: { ComInput },
  data() {
    return {
      iotModel: {},
      formData: {},
      iotDataOri: {},
      pageData: {},
      loading: false,
    };
  },
  mounted() {
    this.initIotModel();
    this.initIotModelRows();
  },
  methods: {
    updateAttr(code, val) {
      // 这里调用物模型的更新操作 - iot-model-attribute-setting
      if (this.iotDataOri[code] == val || (!this.iotDataOri[code] && !val)) {
        return;
      }
      toolAction
        .run("iot-model-attribute-setting", this.comCode, {
          attributeCode: code,
          attributeVal: val,
        })
        .then(() => {
          this.$element.msg();
          this.iotDataOri[code] = val;
        });
    },
    initIotModel() {
      toolAction.run("iot-model", this.comCode).then((res) => {
        this.iotModel = res;
        this.iotModel.attributes.forEach((attr) => {
          this.iotDataOri[attr.code] = attr.val;
        });
      });
    },
    async initIotModelRows() {
      let devices = await thingsDeviceApi.list({
        rules: {
          code__eq: this.comCode,
        },
      });
      if (devices.length < 1) {
        return;
      }
      this.loading = true;
      thingsAttributeApi
        .page({
          rules: {
            is_shadow__eq: 1,
            device_id__eq: devices[0].id,
          },
        })
        .then((res) => {
          this.pageData = res;
          this.loading = false;
        });
    },
  },
};
</script>
<style lang=""></style>
